<template>
	<view class="agent-self">
		<view class="expert-verify">
			<view class="personal-info-top">
				<view class="personal-info-top-contain">
					<view class="personal-info-top-contain-pic">
						<image v-if="userInfoData.accountHead" class="top-bar-info-img" :src="userInfoData.accountHead" mode=""></image>
						<image v-else src="https://www.innovationgloble.com/wxs/img/wx/gkxcx/nologinaccount.png" class="top-bar-info-img" mode=""></image>
					</view>
					<view class="personal-info-top-contain-info">
						<view class="personal-info-top-contain-title">
							{{titleName}}
						</view>
						<view class="personal-info-top-contain-account">
							登录账号：{{userInfoData.phoneNumber}}
						</view>
					</view>
				</view>
			</view>
			<view class="personal-info-base">
				<view class="personal-info-base-title">
					<view class="person-left-ver">

					</view>
					<view class="person-info-base-tip">
						机构信息
					</view>
				</view>
			</view>
			<view class="evan-form-show">
				<view class="nature">
					<view class="nature-t star">机构性质</view>
					<view class="nature-warp">
						<view :class="natureIndex===index?'nature-item-active nature-item':'nature-item'" @click="natureChange(index)"
						 v-for="(item,index) in agentType" :key="index">
							<view class="sign"></view>
							{{item.label}}
							<image v-show="natureIndex===index?true:false" class="sign-img" src="https://www.innovationgloble.com/wxs/img/wx/gkxcx/choose-serve-right.png"></image>
						</view>

					</view>
				</view>
				<evan-form :hide-required-asterisk="hideRequiredAsterisk" ref="form" :model="agentForm">
					<evan-form-item label="单位名称" prop="companyName" class="star-1">
						<input class="form-input" placeholder-class="form-input-placeholder" v-model="agentForm.companyName" placeholder="请输入单位名称" />
					</evan-form-item>
					<evan-form-item label="信用代码" prop="companyCode" class="no-star-1">
						<input class="form-input" placeholder-class="form-input-placeholder" v-model="agentForm.companyCode" placeholder="请输入18位信用代码" />
					</evan-form-item>
					<evan-form-item label="所在地区" prop="city" class="star-1">
						<view style="width: 100%;">
							<picker style="width: 100%;" @change="cityChange" @cancel="cityCancel" mode="multiSelector" @columnchange="bindMultiPickerColumnChange"
							 :value="multiIndex" :range="multiArray" range-key="name">
								<view v-if="workCity!==''" style="border-bottom: none;" placeholder="请输入您的工作城市" name="workCity" class="person-info-input">
									{{selectCityName}}
									<!-- {{multiIndex.length==0?'':(multiArray[0][multiIndex[0]].name+"，"+multiArray[1][multiIndex[1]].name)}} -->
								</view>
							</picker>
						</view>
					</evan-form-item>
					<evan-form-item label="联系人" prop="linkPerson" class="star-1">
						<input class="form-input" placeholder-class="form-input-placeholder" v-model="agentForm.linkPerson" placeholder="请输入联系人姓名" />
					</evan-form-item>
					<evan-form-item label="职务" prop="linkJobDuties" class="star-1">
						<input class="form-input" placeholder-class="form-input-placeholder" v-model="agentForm.linkJobDuties"
						 placeholder="请输入职务" />
					</evan-form-item>
					<evan-form-item label="电话" prop="linkPhone" class="star-1">
						<input class="form-input" placeholder-class="form-input-placeholder" v-model="agentForm.linkPhone" placeholder="请输入手机号" />
					</evan-form-item>
					<evan-form-item label="邮箱" prop="companyEmail" class="star-1">
						<input class="form-input" placeholder-class="form-input-placeholder" v-model="agentForm.companyEmail" placeholder="请输入邮箱" />
					</evan-form-item>
					<view class="expert">
						<view class="expert-title star">机构简介</view>
						<textarea class="p-20" placeholder-class="expert-p20" maxlength="100" placeholder="请输入机构简介,不超过100字" dispatch
						 v-model="agentForm.companyProviders" />
						</view>
					<view class="session">
						<view class="session-title star">
							上传资质证明
						</view>
						<view class="session-image">
							<view>
								<image @click="uploadPosImage" v-if="!positiveImg"  src="https://www.innovationgloble.com/wxs/img/wx/gkxcx/img/public/upload-img.png"></image>
								<image @click="uploadPosImage" mode="aspectFit" :src="positiveImg" ></image>
							</view>
						</view>
						<view class="session-text">
							<view>作为审核材料,图片格式为jpg、png、jpeg</view>
							<view>企业上传营业执照,其他组织可上传相关资质证明</view>
						</view>
					</view>
				</evan-form>
			</view>
			<!-- 提交按钮 -->
			<view class="verify" v-show="isShowSubmit">
				<button @click="toVerify">提交认证</button>
			</view>
			<simple-address  ref="simpleAddress" @onCancel="handleClose" :pickerValueDefault="cityPickerValueDefault" @onConfirm="onConfirm" themeColor="#007AFF"></simple-address>
		</view>
	</view>
	
</template>

<script>
	import EvanForm from '@/components/evan-form/evan-form.vue'
	import EvanFormItem from '@/components/evan-form/evan-form-item.vue'
	import utils from '@/components/evan-form/utils.js'
	import simpleAddress from '@/components/simple-address/simple-address.vue';
	import {mapState,mapMutations} from 'vuex'
	function getDate(type) {
	 const date = new Date();
	
	 let year = date.getFullYear();
	 let month = date.getMonth() + 1;
	 let day = date.getDate();
	
	 if (type === 'start') {
	  year = year - 60;
	 } else if (type === 'end') {
	  year = year + 2;
	 }
	 month = month > 9 ? month : '0' + month;;
	 day = day > 9 ? day : '0' + day;
	
	 return `${year}-${month}-${day}`;
	}
	export default {
		components: {
			EvanForm,
			EvanFormItem,
            simpleAddress,
		},
		data() {
			return {
				agentType:[
					{
						label:'政府',
						type:1
					},
					{
						label:'开发园区',
						type:2
					},
					{
						label:'投资机构',
						type:3
					},
					{
						label:'一般企业',
						type:4
					},
					{
						label:'科研院所',
						type:5
					},
					{
						label:'其他',
						type:7
					}
				],
				natureIndex:0,
				urls: ["https://www.innovationgloble.com/wxs/img/wx/gkxcx/logo.png","https://www.innovationgloble.com/wxs/img/wx/gkxcx/logo.png"],
				titleName:'',
				replacePhonNumber: '',
				userInfoData: {},
				date: '',
				startDate: getDate('start'),
				endDate: getDate('end'),
				multiArray: [
				 [],
				 []
				],
				multiIndex: [],
				originMultiIndex:[],
				options: [],
				defaultRegion1: [],
				agentForm:{
					companyName:'',
					companyCode:'',
					companyEmail:'',
					companyProviders:'',
					businessLicense:'',
					userId:'',
					companyType:'',
					linkPhone:'',
					linkJobDuties:'',
					linkPerson:'',
					type:''
				},
				cityPickerValueDefault: [0, 0, 1],
				pickerText: '',
				showPublic:1,
				desc:'',
				homeChecked:0,
				isChecked:true,
				headPortrait:'',
				backPortrait:'',
				isShowSubmit:true,
				imgSrc:'',
				positiveImg:'',
				backImg:'',
				photoFormData:{
					model:'publish'
				},
				
				imageList: [],
				category: 'image',
				hideRequiredAsterisk: false,
				researchFields:[],
				tecArea:[],
				sexes: [{
						name: '男',
						value: 'man'
					},
					{
						name: '女',
						value: 'woman'
					}
				],
				// 表单的内容必须初始化
				searchArea:[],
				TecArca:[],
				info: {
					searchArea:'请选择',
					TecArca:'请选择',
					research:'',
					desc:'',
					disSearchData:'请选择',
					jobTitle:'',
					companyType:1
				},
				rules: {
					jobTitle: {
						required: true,
						message: '请输入职务头衔'
					},
					disSearchData: {
						required: true,
						message: '请选择研究方向'
					},
					TecArca: {
						required: true,
						message: '请选择技术领域'
					},
					searchArea: {
						required: true,
						message: '请选择研究领域'
					},
					name: {
						required: true,
						message: '请输入姓名'
					},
					companyEmail: [{
						required: true,
						message: '请输入邮箱'
					}, {
						type: 'email',
						message: '邮箱格式不正确'
					}],
					desc: [{
							required: true,
							message: '请输入简介'
						},
						{
							min: 10,
							max: 30,
							message: '简介必须在10到30个字之间'
						}
					],
					phone: [{
							required: true,
							message: '请输入手机号'
						},
						{
							validator: (rule, value, callback) => {
								// 注意这里如果用的是methods里的isMobilePhone将不生效
								if (this.$utils.isMobilePhone(value)) {
									callback()
								} else {
									callback(new Error('手机号格式不正确'))
								}
							}
						}
					],
					sex: {
						required: true,
						message: '请选择性别'
					},
					userInfo:{},
					userInfoData:{},
					agentDetail:{}
				}
			}
		},
		onLoad(options) {
			this.loadIsPerfetInfo();
			
			this.userInfoData = uni.getStorageSync('userInfo');
			this.date = this.userInfoData.birthdate ? this.userInfoData.birthdate.split('T')[0] : '';
			let arr = [...this.userInfoData.phoneNumber];
			for (let i = 0; i < arr.length; i++) {
				if (i > 2 && i < 7) {
					arr[i] = "*"
				}
			}
			this.replacePhonNumber = arr.join('');
			if(this.userInfoData.realName){
				this.titleName = this.userInfoData.realName;
			}else{
				this.titleName = ('用户'+this.replacePhonNumber)
			}
			 this.getAgentDetails();
			 
           try {
            const userInfo = uni.getStorageSync('userInfo');
			this.userInfo = userInfo;
         } catch (e) {
           }		  
		},
		computed: {
		      selectCityName(){
		      	let multiIndex = this.multiIndex;
		      	let multiArray = this.multiArray;
		      	if(multiArray[1][multiIndex[1]]){
		      		return multiIndex.length==0?'':(multiArray[0][multiIndex[0]].name+"，"+multiArray[1][multiIndex[1]].name);
		      	}
		      	else{
		      		console.log('multiArray[1] ', multiArray[1]);
		      		return multiIndex.length==0?'':(multiArray[0][multiIndex[0]].name);
		      	}
		      },
		    },
		methods: {
			...mapMutations('projectStore',['saveSearchData']),
			//机构性质change
			natureChange(index){
				this.natureIndex = index;
				this.agentForm.companyType = this.agentType[index].type;
				console.log(this.agentForm.companyCode)
			},
			//是否完善个人信息0未完善1已经完善
			loadIsPerfetInfo(){
			    this.$request.get({
					url:'user/selectMyCompleteForExpert',
				}).then(res=>{
					if(res===2){
						this.agentForm.type = 2;			
					}else {
						this.agentForm.type = 1;
					}
				})
			},
			//获取经纪人数据
			getAgentDetails(){
				this.$request.get({
					url:'user/selectUserById'
				}).then(res=>{
					console.log('经纪人数据',res)
					this.getAllProvince();
					if(res.companyName===null){
						this.isAdd = true;
						return
					}
					this.agentForm.companyEmail = res.companyEmail;
					this.agentForm.linkPerson = res.linkPerson;
					this.agentForm.linkJobDuties = res.linkJobDuties;
					this.agentForm.linkPhone = res.linkPhone;
					this.agentForm.companyProviders = res.companyProviders;
					this.agentForm.companyCode = res.companyCode;
				    this.agentType.forEach((item,index)=>{
						console.log('当前',index,item,res.companyType)
						if(item.type==res.companyType){
							this.natureIndex = index;
						}
					})
					this.agentForm.companyType = res.companyType;
					this.agentForm.companyName = res.companyName;
					this.agentForm.businessLicense = res.businessLicense;
					this.positiveImg = res.businessLicense
					this.agentDetail = res;
				
					console.log(this.positiveImg)
				})
			},
			doUpload(rsp) {
				console.log(rsp);
				this.$set(this.urls, rsp.index, rsp.path);
				return;
				uni.uploadFile({
					url: '', //仅为示例，非真实的接口地址
					filePath: rsp.path,
					name: 'avatar',
					formData: {
						'avatar': rsp.path
					},
					success: (uploadFileRes) => {
						console.log(uploadFileRes.data);
					},
					complete(res) {
						console.log(res)
					}
				});
			},
			cityCancel(){
			 console.log("取消选择",this.originMultiIndex);
			 let provinceIndex;
			 
			 this.multiArray[0].filter((val,index)=>{
			  if(val.regionId===this.originMultiIndex[0]-0){
			   provinceIndex = index
			  }
			 })
			 console.log(provinceIndex)
			 this.multiIndex.splice(0,1,provinceIndex)
			 let cityIndex;
			 this.multiArray[0][provinceIndex].children.filter((val,index)=>{
			  if(val.regionId===this.originMultiIndex[1]-0){
			   cityIndex = index
			  }
			 })
			 this.multiArray.splice(1,1,this.multiArray[0][provinceIndex].children);
			 this.multiIndex.splice(1,1,cityIndex)
			},
			cityChange(){
			 // console.log("确认选择");
			 // console.log(this.multiIndex);
			 // console.log(this.multiArray);
			 // console.log(this.multiArray[1][this.multiIndex[1]]);
			 // this.originMultiIndex = [this.multiArray[0][this.multiIndex[0]].regionId,this.multiArray[1][this.multiIndex[1]?this.multiIndex[1]:0].regionId]
			 if(this.multiArray[1][this.multiIndex[1]?this.multiIndex[1]:0]){
			 	this.originMultiIndex = [ this.multiArray[0][this.multiIndex[0]].regionId,   this.multiArray[1][this.multiIndex[1]?this.multiIndex[1]:0].regionId]
			 }
			 else{
			 	this.originMultiIndex = [ this.multiArray[0][this.multiIndex[0]].regionId,this.multiArray[1][0].regionId];
			 }
			},
			selectGender(e){
			 console.log(e.detail);
			 this.userInfoData.sex=e.detail-0
			},
			formSubmit: function(e) {
			 console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value));
			 
			 //定义表单规则
			 var rule = [
			  {
			   name: "email",
			   checkType: "email",
			   checkRule: "",
			   errorMsg: "请输入您的邮箱"
			  },
			  {
			   name: "workUnit",
			   checkType: "notnull",
			   checkRule: "",
			   errorMsg: "请输入您的工作单位"
			  }
			 ];
			 if(this.userInfoData.realName.length>20||this.userInfoData.realName.length<0){
			  uni.showToast({
			   title: "姓名应为1-20个字符",
			   icon: "none"
			  });
			  return false
			 }
			 console.log('this.userInfoData.sex',this.userInfoData.sex);
			 if(this.userInfoData.sex!==0&&this.userInfoData.sex!==1){
			  uni.showToast({
			   title: "请选择性别",
			   icon: "none"
			  });
			  return false
			 }
			 if(!this.date){
			  uni.showToast({
			   title: "请选择您的出生日期",
			   icon: "none"
			  });
			  return false
			 }
			 if(this.multiIndex.length<1){
			  uni.showToast({
			   title: "请选择您的工作城市",
			   icon: "none"
			  });
			  return false
			 }
			 //进行表单检查
			 var formData = e.detail.value;
			 var checkRes = graceChecker.check(formData, rule);
			 if (checkRes) {
			  this.userInfoData.province = this.multiArray[0][this.multiIndex[0]].regionId;
			  // this.userInfoData.city = this.multiArray[1][this.multiIndex[0]].regionId;
			  if(this.multiArray[1][this.multiIndex[0]]){
			  	this.userInfoData.city = this.multiArray[1][this.multiIndex[0]].regionId;
			  }
			  console.log(this.userInfoData.province);
			  console.log(this.userInfoData);
			  this.$request.post({
			   url: 'user/updateUserinfo',
			   data: {
			    realName:this.userInfoData.realName,
			    sex:this.userInfoData.sex,
			    email:this.userInfoData.email,
			    birthdate:this.date,
			    workUnit:this.userInfoData.workUnit,
			    province:this.userInfoData.province,
			    city:this.userInfoData.city,
			    userId:this.userInfoData.userId,
			   },
			  }).then(res => {
			   console.log("########",res);
			   uni.navigateBack();
			  })
			  console.log("########");
			  uni.showToast({
			   title: "验证通过!",
			   icon: "none"
			  });
			 } else {
			  uni.showToast({
			   title: graceChecker.error,
			   icon: "none"
			  });
			 }
			},
			formReset: function(e) {
			 console.log('清空数据')
			},
			bindMultiPickerColumnChange: function(e) {
				this.multiIndex[1] = 0
			 console.log('修改的列为：' + e.detail.column + '，值为：' + e.detail.value);
			 if(e.detail.column===0){
			  let provinceIndex = e.detail.value;
			  console.log(this.multiArray[0][provinceIndex]);
			  //获取当前省份id
			  let provinceId = this.multiArray[0][provinceIndex].regionId;
			  this.multiArray[0].filter((val,index)=>{
			   if(val.regionId == provinceId){
			    console.log(index);
			    this.multiIndex.splice(0,1,index);
			    console.log(this.multiIndex);
			    return index
			   }
			  })
			  if(this.multiArray[0][provinceIndex].children){
			   this.multiArray.splice(1, 1, this.multiArray[0][provinceIndex].children);
			  }else{
			   this.getCity(provinceId,provinceIndex,false);
			  }
			  
			 }
			 if(e.detail.column===1){
			  let cityIndex = e.detail.value;
			  this.multiIndex.splice(1,1,cityIndex);
			 }
			 
			 this.$forceUpdate()
			},
			bindDateChange: function(e) {
			 this.date = e.detail.value;
			 console.log(this.date);
			},
			//
			//根据省份获取所在市
			getCity(provinceId , provinceIndex , isConfirm){
			 this.$request.get({
			  url: 'region/queryCityByProvinceId.json',
			  data: {
			   provinceId
			  },
			 }).then(res=>{
			  this.multiArray[0][provinceIndex].children = res;
			  this.multiArray.splice(1, 1, res);
			  console.log('this.agentDetailthis.agentDetailthis.agentDetailthis.agentDetail',this.agentDetail)
			  if(this.agentDetail.companyCity){
			   res.filter((val,index)=>{
			    if(val.regionId == this.agentDetail.companyCity){
			     // this.multiIndex = this.multiIndex.push(index);
			     this.multiIndex.splice(1,1,index);
			     return index
			    }
			   })
			  }
			 })
			},
			getAllProvince() {
			 this.$request.get({
			  url: 'region/queryAllProvinces.json',
			  data: {},
			 }).then(res => {
			  this.multiArray.splice(0, 1, res);
			  console.log('this.agentForm.province',this.agentDetail.companyProvince,this.agentDetail.companyCity)
			  this.originMultiIndex=[this.agentDetail.companyProvince,this.agentDetail.companyCity];
			  //判断用户是否输入省市
			  if(this.agentDetail.companyProvince){
			   let provinceIndex;
			   res.filter((val,index)=>{
			    if(val.regionId == this.agentDetail.companyProvince){
			     provinceIndex=index;
			     this.multiIndex.splice(0,1,index);
			     return index
			    }
			   })
			   this.getCity(this.agentDetail.companyProvince , provinceIndex , true);
			  }else{
			   this.getCity(res[0].regionId,0,false);
			  }
			 })
			},
			//城市选择取消
			handleClose(){
				this.isShowSubmit = true;
			},
			//城市选择确定
			onConfirm(e) {
				this.isShowSubmit = true;
				this.pickerText = e;
				console.log(e.label)
			},
			openAddres() {
				this.isShowSubmit = false;
				this.cityPickerValueDefault = [0,0,1]
				this.$refs.simpleAddress.open();
			},
			//获取官网显示是否展示
			handleCheckChange(e){
				console.log(e.detail.value)
				if(e.detail.value.length===0){
					this.showPublic = 0;
				}else if(e.detail.value.length===1){
					this.showPublic = 1;
				}
			},
			//认证
			toVerify(){
               let params = {};
			   if(this.agentForm.companyName===''||this.agentForm.companyName===null){
				   uni.showToast({
				   	title:'请输入单位名称',
					icon:'none'
				   })
				   return
			   }
			   if(this.selectCityName.length === 0){
				   uni.showToast({
				   	title:'请选择所在地区',
				   	icon:'none'
				   })
				   return
			   }
			   if(this.agentForm.linkPerson===''||this.agentForm.linkPerson===null){
			   		uni.showToast({
			   			title:'请输入联系人姓名',
			   			icon:'none'
			   		})
			   		return						  
			   }
			   if(this.agentForm.linkJobDuties===''||this.agentForm.linkJobDuties===null){
			   					uni.showToast({
			   						title:'请输入联系人职务',
			   						icon:'none'
			   					})
			   					return			  
			   }
			   console.log('联系人姓名',this.agentForm.linkPerson,'职务',this.agentForm.linkJobDuties)
			   			  
			   if(!/^1[345789]\d{9}$/.test(this.agentForm.linkPhone)){
			   		uni.showToast({
			   			title:'请输入正确手机号',
			   			icon:'none'
			   		})
			   		return						  
			   }
			     if(this.agentForm.companyEmail===''||this.agentForm.companyEmail===null){
					 uni.showToast({
					 	title:'请输入邮箱',
					 	icon:'none'
					 })
					 return
				 }
			   　var reg = new RegExp("^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$"); 
			     if(this.agentForm.companyEmail!=""){
					if(!reg.test(this.agentForm.companyEmail)){
										 uni.showToast({
										 	title:'邮箱格式不正确请重新输入',
										 	icon:'none'
										 })
										 return
					}
				 }
				 if(this.agentForm.companyProviders===''){
					uni.showToast({
						title:'请输入机构简介',
						icon:'none'
					})
					return 
				 }
				 if(this.agentForm.businessLicense===''){
					uni.showToast({
						title:'请上传资质证明',
						icon:'none'
					})
					return 
				 }
			   // this.agentForm.province = this.multiArray[0][this.multiIndex[0]].regionId;
			   // if(this.multiArray[1][this.multiIndex[0]]){
			   // 	this.agentForm.city = this.multiArray[1][this.multiIndex[0]].regionId;
			   // }
			   this.agentForm.province = this.originMultiIndex[0];
			   this.agentForm.city = this.originMultiIndex[1];
			    // this.agentForm.city = this.multiArray[1][this.multiIndex[1]].regionId;
			    console.log(this.agentForm)
				try {
				    const userInfo = uni.getStorageSync('userInfo');
					this.agentForm.userId = userInfo.userId;
				    this.$request.post({
				    	url:'user/updateUserInfoForCompany',
				    	data:this.agentForm
				    }).then(res=>{
				    	console.log('....专家',res)
						uni.showToast({
							title:'提交成功',
							success() {
								setTimeout(()=>{
									uni.navigateBack({})
								},500)
							}
						})
				    })
				} catch (e) {
				    // error
				}
				
			},
			//上传反面图片
			uploadBackImage(){
				let that = this;
				try {
				    const userInfo = uni.getStorageSync('userInfo');
				    if (userInfo) {
				        console.log(userInfo);
				    }
					uni.chooseImage({
					    count: 1, //默认9
					    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					    sourceType: ['album'], //从相册选择
					    success: function (res) {
					        console.log(JSON.stringify(res.tempFilePaths));
							
							uni.uploadFile({
								url:this.$baseUrl +'upLoading',
								filePath:res.tempFilePaths[0],
								formData:{
									model:'person'
								},
								name:'file',
								header:{
									token:userInfo.token
								},
								success:(e)=>{
									let res = JSON.parse(e.data);
									console.log('图片上传成功',res)
									if (res.ret){
										uni.showToast({
											title:'图片上传成功'
										})
										that.backPortrait = res.data
										that.backImg = that.$baseUrl + res.data
									}else{
										uni.showToast({
											title:res.errmsg,
											icon:'none'
										})
									}
								},
								fail:res=> {
									uni.showToast({
										title:'图片上传失败',
										icon:'none'
									})
									console.log(res);
								}
							})
					    },
						fail:res=> {
							console.log(res);
						}
					});
					
				} catch (e) {
				    // error
				}
			},
			//上传正面图片
			uploadPosImage(){
				let that = this;
				try {
				    const userInfo = uni.getStorageSync('userInfo');
				    if (userInfo) {
				        console.log(userInfo);
				    }
					uni.chooseImage({
					    count: 1, //默认9
					    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					    sourceType: ['album'], //从相册选择
					    success: function (res) {
					        console.log(JSON.stringify(res.tempFilePaths));
							
							uni.uploadFile({
								url:that.$baseUrl +'upLoading',
								filePath:res.tempFilePaths[0],
								formData:{
									model:'institutions'
								},
								name:'file',
								header:{
									token:userInfo.token
								},
								success:(e)=>{
									let res = JSON.parse(e.data);
									console.log('图片上传成功',JSON.parse(e.data))
									if (res.ret){
										uni.showToast({
											title:'图片上传成功'
										})     
										that.agentForm.businessLicense = res.data
										that.positiveImg =  res.data
									}else{
										uni.showToast({
											title:res.errmsg,
											icon:'none'
										})
									}
								},
								fail:res=> {
									uni.showToast({
										title:'图片上传失败',
										icon:'none'
									})
									console.log(res);
								}
							})
					    },
						fail:res=> {
							console.log(res);
						}
					});
					
				} catch (e) {
				    // error
				}
			},
			uploadImage(){
				let that = this;
				try {
				    const userInfo = uni.getStorageSync('userInfo');
				    if (userInfo) {
				        console.log(userInfo);
				    }
					uni.chooseImage({
					    count: 1, //默认9
					    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					    sourceType: ['album'], //从相册选择
					    success: function (res) {
					        console.log(JSON.stringify(res.tempFilePaths));
							
							uni.uploadFile({
								url:this.$baseUrl +'upLoading',
								filePath:res.tempFilePaths[0],
								formData:{
									model:'publish'
								},
								name:'file',
								header:{
									token:userInfo.token
								},
								success:(e)=>{
									let res = JSON.parse(e.data);
									console.log('图片上传成功',JSON.parse(e.data))
									if (res.ret){
										uni.showToast({
											title:'图片上传成功'
										})
										that.headPortrait = res.data
										that.imgSrc = that.$baseUrl + res.data
									}else{
										uni.showToast({
											title:res.errmsg,
											icon:'none'
										})
									}
								},
								fail:res=> {
									uni.showToast({
										title:'图片上传失败',
										icon:'none'
									})
									console.log(res);
								}
							})
					    },
						fail:res=> {
							console.log(res);
						}
					});
					
				} catch (e) {
				    // error
				}
				
				
			},
			//研究方向页面
			toSearchTabs(){
				uni.navigateTo({
					url:'/pagesB/research-direction/research-direction'
				})
			},
			//文件上传成功回调
			formSubmit(e){
			        this.$refs.upload.uploadFile(Object.assign(formData),function(resp){
			            if(resp.code == 200 ){
			
			            }else{
			
			            }
			        })
			},
			 bindDateChange: function(e) {
			            this.date = e.target.value
			 },
			save() {
				this.$refs.form.validate((res) => {
					if (res) {
						uni.showToast({
							title: '验证通过'
						})
					}
				})
			},
			utilsSave() {
				utils.validate(this.info, this.rules, (res, errors) => {
					if (res) {
						uni.showToast({
							title: '验证通过'
						})
					}
				})
			},
			validateSingle() {
				this.$refs.form.validateField('email', (res) => {
					if (res) {
						uni.showToast({
							title: '验证通过'
						})
					}
				})
			},
			validateMultiple() {
				this.$refs.form.validateField(['email', 'phone'], (res) => {
					if (res) {
						uni.showToast({
							title: '验证通过'
						})
					}
				})
			},
			hideReqired() {
				this.hideRequiredAsterisk = !this.hideRequiredAsterisk
			},
			isMobilePhone() {
				const reg = /^1\d{10}$/
				if (reg.test(value)) {
					return true
				}
				return false
			},
			isMobile(rule, value, callback) {
				if (this.$utils.isMobilePhone(value)) {
					callback()
				} else {
					callback(new Error('手机号格式不正确'))
				}
			},
			sexChange(e) {
				this.info.sex = e.detail.value
			}
		}
	}
</script>

<style   lang='scss'>
	.nature {
	  .nature-t {
	  	color: #666;
	  	margin: 0 22upx;
	  }	
	  .nature-warp {
		  margin: 0 22upx;
		  display: flex;
		  flex-wrap: wrap;
		  justify-content: space-between;
		  margin-top: 30upx;
		  .nature-item {
			  height: 76upx;
			  box-sizing: border-box;
			  padding: 0 32upx;
			  line-height: 76upx;
			  font-size:26upx;
			  font-weight:400;
			  color:rgba(74,74,74,1);
			  display: flex;
			  background-color: #F5F5F5;
			  margin-bottom: 38upx;
			  border-radius:10upx;
			  position: relative;
			  .sign {
				  width: 15upx;
				  height: 15upx;
				  transform: rotate(45deg);
				  background-color: #A5A5A5;
				  margin-right: 15upx;
				  margin-top: 30upx;
			  }
			  .sign-img {
				  width: 44upx;
				  height: 34upx;
				  position: absolute;
				  right: 0;
				  top: 0;
			  }
		  }
		  .nature-item-active {
			  background:rgba(255,255,255,1);
			  box-shadow:0px 2upx 9upx 0px rgba(0,0,0,0.1);
			  color: #2A7DFA;
			  .sign{
				  background-color: #2A7DFA;
			  }
		  }
	  }
	}
	.personal-info-top-contain-pic {
		width: 144upx;
		height: 144upx;
		padding: 2upx;
		background-color: #FFFFFF;
		border-radius: 50%;
	
	}
	.person-info-base-tip {
		font-size: 32upx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: rgba(51, 51, 51, 1);
		margin-left: 21upx;
	}
	.person-left-ver {
		width: 5upx;
		height: 32.5upx;
		background-color: #2A7DFA;
	}
	.personal-info-base {
		background-color: #FFFFFF;
		margin-bottom: 30upx;
	}
	.personal-info-base-title {
		display: flex;
		align-items: center;
		padding: 23upx 30upx;
		border-bottom: 1upx solid #DDDDDD;
	}
	.top-bar-info-img {
		width: 140upx;
		height: 140upx;
		border-radius: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.personal-info-top-contain-info {
		margin-left: 34upx;
	}
	
	.personal-info-top-contain-title {
		font-size: 32upx;
		font-family: PingFangSC-Semibold, PingFang SC;
		font-weight: 600;
		color: rgba(255, 255, 255, 1);
	}
	
	.personal-info-top-contain-account {
		font-size: 24upx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: rgba(255, 255, 255, 1);
	}
	.personal-info-top-contain {
		display: flex;
		align-items: center;
	}
	.personal-info-top {
		width: 100%;
		height: 273upx;
		background-image: url("https://www.innovationgloble.com/wxs/img/wx/info-banner2.png");
		background-size: 100%;
		position: relative;
		padding: 66upx 47upx;
	}
	.agent-self {
		.myimg {
			width: 200upx;
			height: 200upx;
			border-radius: 0 !important;
			margin: 40px;
		}
		.myimg2 {
			width: 200upx;
			height: 200upx;
			border-radius: 100%;
			margin: 40px;
		}
		.star-1 {
			.evan-form-item-container__label {
				box-sizing: border-box;
				padding-left: 24upx!important;
				position: relative;
				
			}
			.evan-form-item-container__label::before{
				content: '*';
				display: block;
				position: absolute;
				left: 0;
				top: 0;
				color: #F56C6C!important;
			}
			
		}
		.no-star-1 {
			.evan-form-item-container__label {
				box-sizing: border-box;
				padding-left: 24upx!important;
				position: relative;
				
			}
		}
		.margin-top25 {
		 margin-top: 25upx;
		}
		
		
		.personal-info-top-contain {
		 display: flex;
		 align-items: center;
		}
		
		.top-bar-info-img {
		 width: 140upx;
		 height: 140upx;
		 border-radius: 50%;
		 display: flex;
		 font-size: 140upx;
		 justify-content: center;
		 align-items: center;
		}
		
		.personal-info-top-contain-info {
		 margin-left: 34upx;
		}
		
		.personal-info-top-contain-title {
		 font-size: 32upx;
		 font-family: PingFangSC-Semibold, PingFang SC;
		 font-weight: 600;
		 color: rgba(255, 255, 255, 1);
		}
		
		.personal-info-top-contain-account {
		 font-size: 24upx;
		 font-family: PingFangSC-Regular, PingFang SC;
		 font-weight: 400;
		 color: rgba(255, 255, 255, 1);
		}
		
		.personal-info-base-title {
		 display: flex;
		 align-items: center;
		 padding: 23upx 30upx;
		 border-bottom: 1upx solid #DDDDDD;
		}
		
		.person-left-ver {
		 width: 5upx;
		 height: 32.5upx;
		 background-color: #2A7DFA;
		}
		
		.person-info-base-tip {
		 font-size: 32upx;
		 font-family: PingFangSC-Medium, PingFang SC;
		 font-weight: 500;
		 color: rgba(51, 51, 51, 1);
		 margin-left: 21upx;
		}
		
		.person-ms-in {
		 color: #DE5A02;
		 font-size: 28upx;
		 font-family: PingFangSC-Medium, PingFang SC;
		 font-weight: 500;
		}
		
		.person-ms-item-title {
		 font-size: 28upx;
		 font-family: PingFangSC-Medium, PingFang SC;
		 font-weight: 500;
		 color: #333333;
		}
		
		.person-info-base-form-contain {
		 padding: 10upx 56upx;
		}
		
		.person-info-input {
		 color: #333;
		 padding-left: 15upx;
		 text-align: right;
		 padding-right: 20upx;
		 padding-top: 20upx;
		 padding-bottom: 20upx;
		}
		
		.person-info-form-item {
		 margin-top: 25upx;
		}
		
		.person-info-form-item-contain {
		 margin-bottom: 25upx;
		}
		
		.uni-list::after {
		 height: 1upx;
		}
		
		.uni-list::before {
		 height: 0;
		}
		
		.person-info-bottom {
		 margin-top: 51upx;
		}
		.person-info-bottom-opt>button{
		 font-size:30upx;
		 font-family:PingFangSC-Regular,PingFang SC;
		 font-weight:400;
		 color:rgba(255,255,255,1);
		 height: 88upx;
		 line-height: 88upx;
		 background-color: #196DEC;
		}
			.expert-p20 {
				font-size:28upx;
				font-family:PingFangSC-Regular,PingFang SC;
				font-weight:400;
				color:rgba(197,196,196,1);
				line-height:46upx;
			}
			.p-20 {
				background:rgba(250,250,250,1);
				width: 100%;
				box-sizing: border-box;
				padding: 18upx 32upx;
			}
			.star {
				position: relative;
				&::before{
					content: '*';
					color: #F56C6C;
					width: 30rpx;
					position: absolute;
					display: inline-block;
					left: -24upx;
				}
			}
			
			.expert {
				padding: 0 0 26upx 26upx;
			}
			.expert-upload {
				width: 158upx;
				height: 204upx;
				position: relative;
				image {
					width: 158upx;
					height: 204upx;
					position: absolute;
					top: 50%;
					transform: translateY(-50%);
				}
			}
			.unSelect{
				color: #808080!important;
			}
			.searchText {
				font-size: 28upx;
				color: #333;
				text-align: right;
				width: 100%;
				-webkit-box-sizing: border-box;
				box-sizing: border-box;
				height: 60upx;
			}
			.expert {
				border-bottom: 2upx solid #F5F5F5;
				padding-bottom: 34upx;
				.expert-title {
					color: #666;
					line-height: 82upx;
					padding: 4upx 0upx;
				}
			}
			.uni-input {
				font-size: 28rpx;
				color: #333;
			}
			.btns {
			font-size: 28rpx;
		     color: #808080;
		     text-align: right;
		     width: 100%;
		     -webkit-box-sizing: border-box;
		      box-sizing: border-box;
		      height: 60rpx;
		
			}
			.footer-btns{
				display: flex;
				width: 100%;
				height: 98upx;
				flex-direction: row;
				background-color: #FFFFFF;
			}
			
			.footer-cancel{
				display: flex;
				flex: 1;
				height: 98upx;
				background-color: #FFFFFF;
				color: #999999;
				font-size: 36upx;
				line-height: 98upx;
				text-align: center;
				/* width: 100%; */
				align-items: center;
				justify-content: center;
				/* padding-top: 30upx; */
			}
			
			.footer-ok{
				display: flex;
				flex: 1;
				height: 98upx;
				background-color: #268CFF;
				color: #FFFFFF;
				font-size: 36upx;
				line-height: 98upx;
				text-align: center;
				/* width: 100%; */
				align-items: center;
				    justify-content: center;
					/* padding-top: 30upx; */
			}
			.gouxuan{
				position: absolute;
				right: 0upx;
				bottom: 0upx;
				width: 40upx;
				height: 40upx;
			}
			.category-item-title-normal{
				font-size: 28upx;
				color: #48526B;
				text-align: center;
				white-space: pre-wrap;
				padding: 0 12upx;
			}
			.category-item-title{
				font-size: 28upx;
				color: #268CFF;
				text-align: center;
				white-space: pre-wrap;
				padding: 0 12upx;
			}
			.popup-content {
				width: 100%;
			}
			.tech-item-normal{
				width: 212upx;
				height: 100upx;
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: center;
				position: relative;
				margin-top: 20upx;
					
				box-shadow: 0 0 24px 0 rgba(56,73,184,0.08);
				border-radius: 8upx;
				background-color: #F5F5F5;
			}
			
			.tech-item{
				width: 212upx;
				height: 100upx;
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: center;
				position: relative;
				margin-top: 20upx;
					
				box-shadow: 0 0 24px 0 rgba(56,73,184,0.08);
				border-radius: 8upx;
				background-color: #E1F2FE;
			}
			.tech-field-panel{
				background-color: #FFFFFF;
				padding: 20upx 20upx;
				box-sizing: border-box;
				display: flex;
				flex-direction: row;
				flex-wrap: wrap;
				align-items: center;
				justify-content: space-between;
			}
			
			.tech-field-desc{
				color: #999999;
				font-size: 26upx;
			}
			.popup-title {
				height: 98rpx;
				line-height: 98rpx;
				font-size: 36rpx;
				color: #2B3754;
				text-align: center;
				background-color: #FFFFFF;
				padding-top: 30rpx;
				-webkit-box-sizing: border-box;
				box-sizing: border-box;
		
			}
			.info {
				margin-top: 16upx;
				background-color: #FFFFFF;
				line-height: 116upx;
				padding: 0 39upx;
			}
			.evan-form-show {
				padding: 0 30rpx;
				background-color: #fff;
			    
				.form-input {
					font-size: 28rpx;
					color: #333;
					text-align: right;
					width: 100%;
					box-sizing: border-box;
					height: 60rpx;
					&.textarea{
						height: 240rpx;
						padding: 24rpx 0;
					}
				}
			
				.form-input-placeholder {		
					color: #999
				}
			
				&__button {
					width: 100%;
					height: 88rpx;
					border-radius: 8rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					padding: 0;
					font-size: 36rpx;
					color: #fff;
					margin-top: 20rpx;
					background-color: #2D87D5;
			
					&::before,
					&::after {
						border: none;
					}
				}
			
				.customize-form-item {
					&__label {
						font-size: 28rpx;
						color: #333;
						margin-bottom: 16rpx;
					}
			
					&__radio {
						display: flex;
						align-items: center;
						margin-bottom: 16rpx;
			
						&__text {
							font-size: 28rpx;
							color: #333;
						}
					}
				}
			}
		.expert-verify {
			box-sizing: border-box;

			.verify-head {
				border-top: 2upx solid #F5F5F5;
				padding: 34upx 44upx 44upx 66upx;
				background-color: #FFFFFF;
				margin-bottom: 16upx;
				.title {
					text-align: center;
					margin-bottom: 24upx;
					image {
						width: 144upx;
						height: 44upx;
						margin: 0 auto;
					}
				}
				.verify-img {
					text-align: center;
					image {
						width: 606upx;
						height: 108upx;
						margin: 0 auto;
					}
				}
				.verify-text {
					display: flex;
					margin-top: 10upx;
					view {
						flex: 1;
						font-size:26upx;
						font-weight:400;
						color:rgba(52,103,196,1);
						line-height:36upx;
					}
					view:nth-child(1){
						box-sizing: border-box;
						padding-left: 10upx;
					}
					view:nth-child(2){
						text-align: center;
					}
					view:nth-child(3){
						text-align: right;
					}
				}
			}
			.verify {
				box-sizing: border-box;
				padding: 60upx 40upx;
				button {
					height:88upx;
					background:rgba(25,109,236,1);
					border-radius:44upx;
					font-size:34upx;
					font-weight:500;
					color:rgba(255,255,255,1);
				}
			}
		}
		.expert-text {
			position: relative;
			.text {
				width:336upx;
				height:76upx;
				font-size:24upx;
				font-weight:400;
				color:rgba(163,163,163,1);
				line-height:38upx;
				position: absolute;
				bottom: 10upx;
				left: 182upx;
			}
		}
		.session {
			border-bottom: 2upx solid #F5F5F5;
			padding-bottom: 34upx;
			padding: 0 26upx;
			.session-title {
				color: #666;
				line-height: 82upx;
				padding: 4upx 0upx;
			}
			.session-image {
				display: flex;
				
				view {
					width: 200upx;
					height: 200upx;
					margin-right: 44upx;
					position: relative;
					overflow: hidden;
					image {
						width: 200upx;
						height: 200upx;
						position: absolute;
						top: 50%;
						transform: translateY(-50%);
					}
				}
			}
			.session-text {
				margin-top: 16upx;
				margin-bottom: 32upx;
				view {
					font-size:24upx;
					font-weight:400;
					color:rgba(163,163,163,1);
				}
			}
		}
	}
</style>
